<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
        <!DOCTYPE html>
        <html lang="en">

        <head>
            <%@ include file="templates/header-css.jsp"%>
                <title>投诉订单</title>
        </head>

        <body class="gray-bg">


            <!--Header-->
            <%@ include file="templates/navbar.jsp" %>

                <div class="mid-nav shadow-div">
                    <div class="row">
                        <div class="col-md-offset-1 col-md-10" style="margin-top:20px;">
                            <c:forEach var="order" items="${complaintorders}">
                                <c:set value="0" var="sum" />
                                <c:if test="${order.complaint != null}">
                                    <table class="table table-condensed">
                                        <tr class="bg-info">
                                            <td class="item-1-3 text-center">${order.merchant_name}</td>
                                            <td class="item-1-3 text-center">${order.date_msg}</td>
                                            <td class="item-1-3 text-center">${order.status_msg}</td>
                                        </tr>
                                        <tr>
                                            <td colspan="4">
                                                <ul class="list-group">
                                                    <c:forEach var="food" items="${order.foodlist}">
                                                        <li class="list-group-item">
                                                            <div class="media">
                                                                <div class="media-left">
                                                                    <a href="javascript:void(0);">
                                                                        <img class="img-responsive img-thumbnail media-object" src="${myPicServer}${food.fViewPath}" alt="placeholder" width="100" height="100">
                                                                    </a>
                                                                </div>
                                                                <div class="media-body">
                                                                    <h4 class="media-heading">${food.fName}</h4>
                                                                    <h4 class="pull-left">x ${food.num}</h4>
                                                                    <h4 class="pull-right">${food.fPrice}元</h4>
                                                                    <c:set value="${food.num*food.fPrice+sum}" var="sum" />
                                                                </div>
                                                            </div>
                                                        </li>
                                                    </c:forEach>

                                                </ul>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td colspan="1" class="text-left">
                                                <div class="hidden" name="oid">${order.oId}</div>
                                                <button type="button" class="btn btn-common btn-sm" data-toggle="modal" data-target="#evalution_modal" data-oid="${order.oId}" data-comp="${order.complaint}">
                                                    查看投诉结果
                                                </button>
                                            </td>
                                            <td colspan="2" class="text-right" name="total">
                                                总价：${sum}元
                                            </td>
                                        </tr>
                                    </table>
                                </c:if>
                            </c:forEach>


                        </div>
                    </div>
                </div>

                <a href="#top">
                    <div class="top-box">
                        <span class="glyphicon glyphicon-chevron-up back-icon"></span>
                    </div>
                </a>

                <!-- 投诉模态框 -->
                <div class="modal fade" id="evalution_modal" tabindex="-1" role="dialog" aria-labelledby="evalution-title">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header gold-bg">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                <h4 class="modal-title" id="evalution-title">投诉</h4>
                            </div>
                            <div class="modal-body">
                                <div class="hidden">oid</div>
                                <textarea class="form-control" rows="3" style="resize:none;" placeholder="投诉建议" readonly></textarea>
                                <hr>
                                <div class="well well-sm">投诉结果</div>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-common btn-block" data-dismiss="modal">确认</button>
                            </div>
                        </div>
                    </div>
                </div>

                <footer>
                    <%@ include file="templates/footer.jsp"%>
                        <script type="text/javascript">
                            //投诉框初始化
                            function init_evalModal() {
                                //投诉框显示
                                $("#evalution_modal").on("show.bs.modal", function (event) {
                                    var button = $(event.relatedTarget);
                                    var comp = button.data("comp");
                                    var oid = button.data("oid");
                                    var modal = $(this);
//                                    modal.find(".modal-body .hidden").html(oid);
                                    
                                    $.ajax({
                                        type: "GET",
                                        url: "${pageContext.request.contextPath}/action/complaintStatusByOId",
                                        data:{
                                            oId: oid,
                                        },
                                        success: function(data, status){
                                            modal.find(".modal-body textarea").val(comp);
                                            modal.find(".modal-body .well").html(data.msg);
                                        },
                                        error: function(){
                                            modal.find(".modal-body textarea").val("未获取到数据，请重试");
                                            modal.find(".modal-body .well").html("未获取到数据，请重试");
                                        }
                                    });
                                });


                            };

                            $(document).ready(function () {
                                init_evalModal();
                            });
                        </script>
                </footer>
        </body>

        </html>